<template>
<div id="app">
  {{message}}<br>
  <span v-for="user in users"  v-bind:class="user.date=='2016-05-02'?bgColor:''">
    {{user.date}}--{{user.name}}--{{user.pro}}--{{user.city}}--{{user.address}}  <button @click="look(user)">查看</button><br>
  </span>
</div>
</template>

<script>
export default {
  name: "UserView",
  data(){
    return{
     message:'hello Vue!',
      bgColor:'green',
      users:[
          {date:'2016-05-02',name:'王小虎',pro:'上海',city:'普陀区',address:'上海市'},
          {date:'2016-05-04',name:'王小虎2',pro:'上海2',city:'普陀区',address:'上海市'},
          {date:'2016-05-01',name:'王小虎3',pro:'上海3',city:'普陀区',address:'上海市'},
          {date:'2016-05-03',name:'王小虎4',pro:'上海4',city:'普陀区',address:'上海市'},
      ]
    }
  },methods:{
    look(user){
      alert(JSON.stringify(user))
    }

  },created() {

  }
}
</script>

<style scoped>
.green{
  background-color: green;
}
</style>